<template>


    <!--<marquee loop="1">This text will scroll from right to left</marquee>-->

    <a-tabs style="margin-top: 20px;margin-left: 100px">

        <a-tab-pane key="1" style="margin-right: 100px">
            <template #title>
                <icon-fire />
                防火安全知识
            </template>

            <HuoZaiView></HuoZaiView>
        </a-tab-pane>
        <a-tab-pane key="2">
            <template #title>
                <icon-safe />
                防诈骗安全知识
            </template>

            <!--轮播图-->
            <ZhaPianView></ZhaPianView>
        </a-tab-pane>

        <a-tab-pane key="3">
            <template #title>
                <icon-exclamation-circle />
                毒品知识
            </template>

            <DuPingView></DuPingView>

        </a-tab-pane>
    </a-tabs>


</template>

<script setup>
    import {reactive} from 'vue'
    import message from "@arco-design/web-vue/es/message";
    import {ref} from "@vue/reactivity";
    import myAxios from '../plugins/myAxios';
    import {useRoute} from "vue-router";
    import {useRouter} from "vue-router";
    import {onMounted, watchEffect} from "@vue/runtime-core";
    import {getCurrentUser} from "@/services/user";
    import ZhaPianView from "@/views/ZhaPianView.vue"
    import HuoZaiView from "@/views/HuoZaiView";
    import DuPingView from "@/views/DuPingView";

    const router = useRouter();
    const route = useRoute();


    const handleChange=(value)=>{
        console.log(value)
    }


</script>

<style scoped>

   /* .frame-bg {
        max-width: 780px;
        padding: 40px;
        background: var(--color-fill-2);
    }*/


</style>
